import 'dart:io';

import 'package:bruno/bruno.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:getwidget/getwidget.dart';
import 'package:images_picker/images_picker.dart';
import 'package:meal/constant/sizes.dart';
import 'package:meal/route/route.dart';
import 'package:meal/utils/colors.dart';
import 'package:meal/utils/styles.dart';
import 'package:meal/utils/tools.dart';

///
/// 申请开店流程
///
class FlowStore extends StatefulWidget {
  const FlowStore({Key? key}) : super(key: key);

  @override
  State<FlowStore> createState() => _FlowStoreState();
}

class _FlowStoreState extends State<FlowStore> {
  bool isChecked = true;

  String path = '';

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      appBar: ToolsUtils.getDefaultBrnAppBar('我要开店'),
      body: SingleChildScrollView(
        physics: const BouncingScrollPhysics(),
        padding: const EdgeInsets.only(top: Sizes.default80, bottom: Sizes.default80),
        child: Column(
          children: [
            Container(
              padding: const EdgeInsets.symmetric(horizontal: Sizes.default25),
              margin: const EdgeInsets.only(bottom: Sizes.default30),
              child: Column(
                children: [
                  Container(
                    alignment: Alignment.centerLeft,
                    margin: const EdgeInsets.only(top: Sizes.default20),
                    child: Text('开店流程',
                        style: StylesUtils.customTextStyle(
                            fontSize: Sizes.default16, color: ColorsUtils.color333)),
                  ),
                  Container(
                    alignment: Alignment.centerLeft,
                    margin: const EdgeInsets.only(top: Sizes.default20),
                    child: BrnHorizontalSteps(
                      steps: [
                        BrunoStep(
                            stepContent: Text('提交资料',
                                style: StylesUtils.customTextStyle(
                                    fontSize: Sizes.default15, color: ColorsUtils.color333)),
                            state: BrunoStepState.complete,
                            completedIcon: GFAvatar(
                              size: Sizes.default30,
                              backgroundColor:
                                  ColorsUtils.parseColorFromHexString(ColorsUtils.colorFf6),
                              child:
                                  Text('1', style: StylesUtils.defaultTextStyle(Sizes.default20)),
                            )),
                        BrunoStep(
                            stepContent: Text('平台审核',
                                style: StylesUtils.customTextStyle(
                                    fontSize: Sizes.default15, color: ColorsUtils.color333)),
                            state: BrunoStepState.complete,
                            completedIcon: GFAvatar(
                              size: Sizes.default30,
                              backgroundColor:
                                  ColorsUtils.parseColorFromHexString(ColorsUtils.colorFf6),
                              child:
                                  Text('2', style: StylesUtils.defaultTextStyle(Sizes.default20)),
                            )),
                        BrunoStep(
                            stepContent: Text('开始营业',
                                style: StylesUtils.customTextStyle(
                                    fontSize: Sizes.default15, color: ColorsUtils.color333)),
                            state: BrunoStepState.complete,
                            completedIcon: GFAvatar(
                              size: Sizes.default30,
                              backgroundColor:
                                  ColorsUtils.parseColorFromHexString(ColorsUtils.colorFf6),
                              child:
                                  Text('3', style: StylesUtils.defaultTextStyle(Sizes.default20)),
                            ))
                      ],
                    ),
                  )
                ],
              ),
            ),
            Container(
              padding: const EdgeInsets.symmetric(horizontal: Sizes.default15),
              margin: const EdgeInsets.only(bottom: Sizes.default30),
              child: Column(
                children: [
                  Container(
                    alignment: Alignment.centerLeft,
                    margin: const EdgeInsets.only(bottom: Sizes.default15),
                    child: Text(
                      '您需要准备以下材料：',
                      style: StylesUtils.customTextStyle(
                          fontSize: Sizes.default18, color: ColorsUtils.color333),
                    ),
                  ),
                  Container(
                    margin: const EdgeInsets.only(bottom: Sizes.default30),
                    child: Row(
                      children: [
                        InkWell(
                          onTap: () {
                            ToolsUtils.openGalleryOrCamera(context, (List<Media> res) {
                              uploadFilePath(res);
                            }, (List<Media> res) {
                              uploadFilePath(res);
                            }, 1);
                          },
                          child: path.isNotEmpty
                              ? GFImageOverlay(image: FileImage(File(path)), width: 140, height: 90)
                              : Container(
                            width: 140,
                            height: 90,
                            decoration: BoxDecoration(
                                image: DecorationImage(
                                    image: ToolsUtils.assetImage('upload_bg.png'),
                                    alignment: Alignment.topLeft)),
                          ),
                        ),
                        Expanded(
                            child: Container(
                              padding: const EdgeInsets.only(left: Sizes.default15),
                              child: Column(
                                children: [
                                  Container(
                                    alignment: Alignment.centerLeft,
                                    child: Text('1、实体店铺照片',
                                        style: StylesUtils.customTextStyle(
                                            fontSize: Sizes.default15, color: ColorsUtils.color333)),
                                  ),
                                  Container(
                                    alignment: Alignment.centerLeft,
                                    margin: const EdgeInsets.only(top: Sizes.default8),
                                    child: Text(
                                      '需要提供有完整牌匾的门面照片和真实内部环境照片',
                                      style: StylesUtils.customTextStyle(color: ColorsUtils.color5e5),
                                    ),
                                  )
                                ],
                              ),
                            ))
                      ],
                    ),
                  ),
                  Container(
                    margin: const EdgeInsets.only(bottom: Sizes.default30),
                    child: Row(
                      children: [
                        InkWell(
                          onTap: () {
                            ToolsUtils.openGalleryOrCamera(context, (List<Media> res) {
                              uploadFilePath(res);
                            }, (List<Media> res) {
                              uploadFilePath(res);
                            }, 1);
                          },
                          child: path.isNotEmpty
                              ? GFImageOverlay(image: FileImage(File(path)), width: 140, height: 90)
                              : Container(
                            width: 140,
                            height: 90,
                            decoration: BoxDecoration(
                                image: DecorationImage(
                                    image: ToolsUtils.assetImage('upload_bg.png'),
                                    alignment: Alignment.topLeft)),
                          ),
                        ),
                        Expanded(
                            child: Container(
                              padding: const EdgeInsets.only(left: Sizes.default15),
                              child: Column(
                                children: [
                                  Container(
                                    alignment: Alignment.centerLeft,
                                    child: Text('2、法人身份证正面',
                                        style: StylesUtils.customTextStyle(
                                            fontSize: Sizes.default15, color: ColorsUtils.color333)),
                                  ),
                                  Container(
                                    alignment: Alignment.centerLeft,
                                    margin: const EdgeInsets.only(top: Sizes.default8),
                                    child: Text(
                                      '需要提供营业执照法人的身份证正面照片',
                                      style: StylesUtils.customTextStyle(color: ColorsUtils.color5e5),
                                    ),
                                  )
                                ],
                              ),
                            ))
                      ],
                    ),
                  ),
                  Container(
                    margin: const EdgeInsets.only(bottom: Sizes.default30),
                    child: Row(
                      children: [
                        InkWell(
                          onTap: () {
                            ToolsUtils.openGalleryOrCamera(context, (List<Media> res) {
                              uploadFilePath(res);
                            }, (List<Media> res) {
                              uploadFilePath(res);
                            }, 1);
                          },
                          child: path.isNotEmpty
                              ? GFImageOverlay(image: FileImage(File(path)), width: 140, height: 90)
                              : Container(
                            width: 140,
                            height: 90,
                            decoration: BoxDecoration(
                                image: DecorationImage(
                                    image: ToolsUtils.assetImage('upload_bg.png'),
                                    alignment: Alignment.topLeft)),
                          ),
                        ),
                        Expanded(
                            child: Container(
                              padding: const EdgeInsets.only(left: Sizes.default15),
                              child: Column(
                                children: [
                                  Container(
                                    alignment: Alignment.centerLeft,
                                    child: Text('3、法人身份证反面',
                                        style: StylesUtils.customTextStyle(
                                            fontSize: Sizes.default15, color: ColorsUtils.color333)),
                                  ),
                                  Container(
                                    alignment: Alignment.centerLeft,
                                    margin: const EdgeInsets.only(top: Sizes.default8),
                                    child: Text(
                                      '需要提供营业执照法人的身份证反面照片',
                                      style: StylesUtils.customTextStyle(color: ColorsUtils.color5e5),
                                    ),
                                  )
                                ],
                              ),
                            ))
                      ],
                    ),
                  ),
                  Container(
                    margin: const EdgeInsets.only(bottom: Sizes.default30),
                    child: Row(
                      children: [
                        InkWell(
                          onTap: () {
                            ToolsUtils.openGalleryOrCamera(context, (List<Media> res) {
                              uploadFilePath(res);
                            }, (List<Media> res) {
                              uploadFilePath(res);
                            }, 1);
                          },
                          child: path.isNotEmpty
                              ? GFImageOverlay(image: FileImage(File(path)), width: 140, height: 90)
                              : Container(
                            width: 140,
                            height: 90,
                            decoration: BoxDecoration(
                                image: DecorationImage(
                                    image: ToolsUtils.assetImage('upload_bg.png'),
                                    alignment: Alignment.topLeft)),
                          ),
                        ),
                        Expanded(
                            child: Container(
                              padding: const EdgeInsets.only(left: Sizes.default15),
                              child: Column(
                                children: [
                                  Container(
                                    alignment: Alignment.centerLeft,
                                    child: Text('4、营业执照',
                                        style: StylesUtils.customTextStyle(
                                            fontSize: Sizes.default15, color: ColorsUtils.color333)),
                                  ),
                                  Container(
                                    alignment: Alignment.centerLeft,
                                    margin: const EdgeInsets.only(top: Sizes.default8),
                                    child: Text(
                                      '需要提供有效的营业执照，或监管部门认可的具有与营业执照同等法律效力的其他证件',
                                      style: StylesUtils.customTextStyle(color: ColorsUtils.color5e5),
                                    ),
                                  )
                                ],
                              ),
                            ))
                      ],
                    ),
                  ),
                  Container(
                    margin: const EdgeInsets.only(bottom: Sizes.default30),
                    child: Row(
                      children: [
                        InkWell(
                          onTap: () {
                            ToolsUtils.openGalleryOrCamera(context, (List<Media> res) {
                              uploadFilePath(res);
                            }, (List<Media> res) {
                              uploadFilePath(res);
                            }, 1);
                          },
                          child: path.isNotEmpty
                              ? GFImageOverlay(image: FileImage(File(path)), width: 140, height: 90)
                              : Container(
                            width: 140,
                            height: 90,
                            decoration: BoxDecoration(
                                image: DecorationImage(
                                    image: ToolsUtils.assetImage('upload_bg.png'),
                                    alignment: Alignment.topLeft)),
                          ),
                        ),
                        Expanded(
                            child: Container(
                              padding: const EdgeInsets.only(left: Sizes.default15),
                              child: Column(
                                children: [
                                  Container(
                                    alignment: Alignment.centerLeft,
                                    child: Text('5、许可证',
                                        style: StylesUtils.customTextStyle(
                                            fontSize: Sizes.default15, color: ColorsUtils.color333)),
                                  ),
                                  Container(
                                    alignment: Alignment.centerLeft,
                                    margin: const EdgeInsets.only(top: Sizes.default8),
                                    child: Text(
                                      '需要提供有效的许可证，或监管部门认可的具有与许可证同等法律效力的其他证件',
                                      style: StylesUtils.customTextStyle(color: ColorsUtils.color5e5),
                                    ),
                                  )
                                ],
                              ),
                            ))
                      ],
                    ),
                  ),
                ],
              ),
            ),
          ],
        ),
      ),
      resizeToAvoidBottomInset: false,
      extendBody: true,
      extendBodyBehindAppBar: true,
      bottomNavigationBar: SafeArea(
        top: false,
        child: Container(
          height: Sizes.default110,
          alignment: Alignment.topCenter,
          padding: const EdgeInsets.all(Sizes.default10),
          decoration: const BoxDecoration(
            color: Colors.white
          ),
          child: Column(
            children: [
              Container(
                alignment: Alignment.centerLeft,
                margin: const EdgeInsets.only(bottom: Sizes.default10),
                child: Wrap(
                  spacing: Sizes.default10,
                  crossAxisAlignment: WrapCrossAlignment.center,
                  children: [
                    BrnCheckbox(
                      radioIndex: 1,
                      onValueChangedAtIndex: (int index, bool value) {
                        isChecked = value;
                        setState(() {});
                      },
                      isSelected: isChecked,
                      childOnRight: true,
                      mainAxisSize: MainAxisSize.min,
                      child: Text(
                        '我已阅读并同意签署',
                        style: StylesUtils.customTextStyle(
                            fontSize: Sizes.default13, color: ColorsUtils.colorE7e),
                      ),
                    ),
                    InkWell(
                      onTap: () {
                        Get.toNamed(RouteGet.userAboutProtocol);
                      },
                      child: Text('《开店说明》',
                          textAlign: TextAlign.center,
                          textDirection: TextDirection.ltr,
                          style: StylesUtils.customTextStyle(
                              color: ColorsUtils.colorFf6, fontSize: Sizes.default13)),
                    )
                  ],
                ),
              ),
              SizedBox(
                height: Sizes.default40,
                child: FractionallySizedBox(
                  widthFactor: 0.95,
                  child: GFButton(
                      onPressed: () {
                        Get.toNamed(RouteGet.categorySelected);
                      },
                      text: '我准备好了',
                      textStyle: StylesUtils.customTextStyle(fontSize: Sizes.default16),
                      shape: GFButtonShape.pills,
                      type: GFButtonType.solid,
                      size: GFSize.LARGE,
                      color: ColorsUtils.parseColorFromHexString(
                          isChecked ? ColorsUtils.colorFf6 : ColorsUtils.color666)),
                ),
              )
            ],
          ),
        ),
      ),
    );
  }

  void uploadFilePath(List<Media> res) {
    Media media = res[0];
    path = media.path;
    setState(() {});
  }
}
